import React from 'react';
import "./index.less"
import {
    SearchBar,
    InputItem,
    List,
    WingBlank,
    Carousel,
    TabBar,
    Button,
} from 'antd-mobile';
import TabBarExample from 'components/tabBar'
import TopBarExample from 'components/topBar'


export default class OrderDetail extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            id: 0,
            shopCar: false,
            data: {}
        }
    }

    componentDidMount() {
        this.props.location.state ? this.setState({
            id: this.props.location.state.id,
            shopCar: this.props.location.state.shopCar
        }): null
    }


    // 返回上一页
    addVConsolePackage = () => {
        this.props.history.goBack()
    };


    render() {
        return (
            <div className="orderDetail">
                <TopBarExample title={'订单详情'} autoBack={this.addVConsolePackage} showBack={true}></TopBarExample>
                <div className="orderDetail-state">
                    售后完成
                </div>
                <div className="orderDetail-good">
                    <div className="item-img">
                        <img
                            src={`https://zos.alipayobjects.com/rmsportal/WXoqXTHrSnRcUwEaQgXJ.png`}
                            alt=""
                            style={{ width: '80px', height: '80px',}}
                            onLoad={() => {
                                // fire window resize event to change height
                            }}
                        />
                    </div>
                    <div className="item-text">
                        <div className="item-text-1">
                            【热卖商品】{'测试行频测试行频测试行频测试行频测试行频行频测试行频测试行行频测试行频测试行'}
                        </div>
                        <div className="item-num-2">
                            <div>128礼品卡</div>
                            <div>x1</div>
                        </div>
                    </div>
                </div>
                <div className="orderDetail-content">
                    <div className="orderDetail-content-item">
                        <span>订单编号：</span>
                        <span>12312</span>
                    </div>
                    <div className="orderDetail-content-item">
                        <span>下单时间：</span>
                        <span>321323</span>
                    </div>
                    <div className="orderDetail-content-item">
                        <span>支付方式：</span>
                        <span>343</span>
                    </div>
                    <div className="orderDetail-content-item">
                        <span>退款原因：</span>
                        <span>45</span>
                    </div>
                    <div className="orderDetail-content-item">
                        <span>退款凭证：</span>
                        <span>45</span>
                    </div>
                </div>
                <div className="orderDetail-good-price">
                    <div className="orderDetail-good-price-title">
                        <span>商品总额：</span>
                        <span>12323</span>
                    </div>
                    <div className="orderDetail-good-price-info">
                        <span>实付款：</span>
                        <span>128.00礼品卡</span>
                    </div>
                </div>
            </div>
        );
    }
}

